<script setup>
import {ref,onMounted} from 'vue'
import {decrypt} from '@/utils/parseDate'
import {ElMessage} from 'element-plus'
import ListItem from '@/components/listItem/ListItem.vue'
import Pagination from '@/components/pagination/Pagination'
import {hotList, professionList, second, train} from '@/api/api'
import {useStore} from 'vuex'
// 获取store
const store = useStore()
const loading = ref(false)
// 搜索专业id
const search = ref('')
const educateTypeOption = ref([
  {
    label: '学术型硕士',
    value: 1
  },
  {
    label: '专业学位硕士',
    value: 2
  }
])
const props = {
  lazy: true,
  children: 'children',
  // leaf: 'isLeaf',
  lazyLoad: (node, resolve) => {
    const { level, pathValues } = node
    if (level === 1) {
      train().then(res=>{
        if(res.status === 0){
          let arr = []
					if(pathValues[0]==1){
						arr = res.result.subjectCategoryRsps.map(ele => ({
							label: ele.subjectCategoryName,
							leaf: level >= 3,
							value: ele.subjectCategoryCode
						}))
					} else if(pathValues[0]==2){
						arr = res.result.subjectCategoryRspsForZhuan.map(ele => ({
							label: ele.subjectCategoryName,
							leaf: level >= 3,
							value: ele.subjectCategoryCode
						}))
					}
          resolve(arr)
        } else {
          resolve(undefined)
        }
      })
      
    }
    if(level === 2){
      second({ subjectCategoryCode:pathValues[1] ,educateType: pathValues[0] }).then(res => {
        if(res.status ===0){
          const arr = res.result.map(ele=>({
            label:ele.major1Name,
            leaf: level>=3,
            value: ele.major1Code
          }))
          if(arr.length === 0){
            resolve(undefined)
          } else {
            resolve(arr)
          }
        }else {
          resolve(undefined)
        }
      })
    }
    if(level === 3){
      professionList({educateTypes: pathValues[0],subjectCategoryCode: pathValues[1],major1Code: pathValues[2]}).then(res=>{
        if(res.status === 0){
          const arr = res.result.data.map(ele=>({
            label:ele.majorName,
            value:ele.majorCode,
            leaf: level>=3
          }))
          resolve(arr)
        } else {
          resolve(undefined)
        }
      })
    }
    if(level === 4){
      resolve(undefined)
    }
  }
}
// 分页
const pageNum = ref(1)
const pageSize = ref(10)
const total = ref(0)
// 页码改变
function pageChange(page){
  pageNum.value = page
  if(search.value){
    getHotData()
  } else {
    getTestHotData()
  }
}
// 分页大小改变
function sizeChange(size){
  pageSize.value = size
  if(search.value){
    getHotData()
  } else {
    getTestHotData()
  }
}
// 列表数据
const listData = ref([])
// 获取热点数据
async function getHotData(){
  try {
    if(!search.value){
      ElMessage.warning('请选择专业!')
      return
    }
    loading.value = true
    const data = {
      pageNum: pageNum.value,
      pageSize:pageSize.value,
      majorCode: search.value[search.value.length - 1]
    }
    const result = await hotList(data)
    const res = JSON.parse(decrypt(result))
    console.log(res,8)
    if (res.status == 8) {
      store.commit("setTipsDialog", true);
    }
    if (res.status == 9) {
      store.commit("setNumberDialog", true);
    }
    if(res.status === 0){
      res.result.data.forEach(ele=>{
        if(ele.schoolTag){
          ele.schoolTag = ele.schoolTag.split('|')
        }
        ele.checked = false
      })
      total.value = res.result.total
      listData.value = res.result.data
    }
    loading.value = false
  } catch (e) {
    loading.value = false
    // throw new Error(e)
  }
}
// 选择目标专业
function professionChange(val){
}
// 默认加载
async function getTestHotData(){
  try {
    loading.value = true
    const data = {
      pageNum: pageNum.value,
      pageSize:pageSize.value,
      majorCode: search.value[search.value.length - 1] || '010100'
    }
    const result = await hotList(data)
    const res = JSON.parse(decrypt(result))
    if (res.status == 8) {
      store.commit("setTipsDialog", true);
    }
    if (res.status == 9) {
      store.commit("setNumberDialog", true);
    }
    if(res.status === 0){
      res.result.data.forEach(ele=>{
        if(ele.schoolTag){
          ele.schoolTag = ele.schoolTag.split('|')
        }
        ele.checked = false
      })
      total.value = res.result.total
      listData.value = res.result.data
    }
    loading.value = false
  } catch (e) {
    loading.value = false
    // throw new Error(e)
  }
}
onMounted(()=>{
  getTestHotData()
})
</script>
<template>
	<div class="hot">
    <div class="header">
      <el-cascader
        v-model="search"
        size="large"
        :options="educateTypeOption"
        :props="props"
        class="cascader"
        clearable
				placeholder="报考热点"
        @change="professionChange"
      />
      <el-button @click="getHotData" type="primary" color="#ff7214" size="large">查询</el-button>
    </div>
    <div class="con" v-loading="loading" element-loading-text="数据加载中...">
      <ListItem :data="listData" :pageNum="pageNum"></ListItem>
      <Pagination
        v-if="listData.length> 0"
        :total="total"
        :pageNum="pageNum"
        :pageSize="pageSize"
        @currentChange="pageChange"
        @sizeChange="sizeChange"
      ></Pagination>
    </div>
  </div>
</template>
<style lang="less" scoped>
.hot{
  box-sizing: border-box;
  padding-top: 16px;
  height: 100%;
	width: 100%;
  .header{
    height: 54px;
    padding: 0 calc((100vw - 1200px)/2);
		min-width: 1200px;
    /deep/ .cascader{
      width: 360px !important;
    }
    .el-button{
      margin-left: 10px;
      color: #fff;
    }
  }
	.con{
		padding: 0 calc((100vw - 1200px)/2);
		min-width: 1200px;
		height: calc(100% - 54px);
		overflow: auto;
	}
}
</style>
